<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
<script type="text/javascript">
  setTimeout(function () {
    notify('任务动态通知', '王佩完成了任务')
  }, 2000)

  function notify($title, msg) {
    showMsgNotification($title, msg);

  }

  function showMsgNotification(title, msg, icon) {
    var options = {
      body: msg,
      icon: icon || "http://static.vilson.xyz/20171110154948_53004a2d25f8c5ec929f2104950d1966"
    };
    var Notification = window.Notification || window.mozNotification || window.webkitNotification;
    if (Notification && Notification.permission === "granted") {
      var instance = new Notification(title, options);
      instance.onclick = function () {
        // Something to do
        window.location.href = instance.icon
      };
      instance.onerror = function () {
        // Something to do
      };
      instance.onshow = function () {
        // Something to do
//                          setTimeout(instance.close, 3000);
        setTimeout(function () {
          instance.close();
        }, 10000)
        console.log(instance.body)
      };
      instance.onclose = function () {
        // Something to do
      };
      console.log(instance)
    } else if (Notification && Notification.permission !== "denied") {
      Notification.requestPermission(function (status) {
        if (Notification.permission !== status) {
          Notification.permission = status;
        }
        // If the user said okay
        if (status === "granted") {
          var instance = new Notification(title, options);
          instance.onclick = function () {
            // Something to do
          };
          instance.onerror = function () {
            // Something to do
          };
          instance.onshow = function () {
            // Something to do
            setTimeout(instance.close, 3000);
          };
          instance.onclose = function () {
            // Something to do
          };
        } else {
          return false
        }
      });
    } else {
      return false;
    }
  }
</script>
</html>